<template>
	<view class="content">
		<view style="height: 100rpx;"></view>
		<image class="logo" src="../../static/img/logo.png" style="width: 100%;" mode="widthFix"></image>
	    <view class="login_title">
	     	登录
	     </view>
		 <form>
			 <input type="text" placeholder="请输入手机号" v-model="phone" class="phone" placeholder-style="font-size:30rpx;color:#b8b8b8" @blur="getphone()"/>
			 <input type="password" placeholder="请输入密码" v-model="password" class="password" placeholder-style="font-size:30rpx;color:#b8b8b8"/>
			 <view class="clear" style="width: 80%;margin:30px auto 10px;" v-if="isyz">
				  <input type="text" placeholder="请输入验证码" v-model="code" class="yanzhengma left" placeholder-style="font-size:30rpx;color:#b8b8b8"/>
				  <button class="getyz left" type="button" @tap="getsms_captcha()" style="color: #348bf6;" :disabled="disabled">{{acquire}}</button>
			 </view>
			 <view class="xieyi"><radio value="r1" :checked="xieyi" style="transform:scale(0.5)" @tap="changexieyi()"/>您已阅读并同意<text style="color: #007AFF;" @tap="goxieyi()">《服务协议》</text></view>
			 <view style="height: 150rpx;"></view>
			 <button class="big_button button_shadow" @tap="tologin()"style="height: 100rpx;line-height: 100rpx;border-radius: 50rpx; ">
			 	登录
			 </button>
		 </form>
	</view>
	
</template>

<script>
	// 公共域名
	import httpPath from '@/static/js/path.js';
	import {getlogin} from '@/static/js/login.js';
	export default {
		data() {
			return {
				phone:"",
				password:"",
				code:"",
				// title: 'Hello',
				uuid:"",//设备的唯一标识
				isyz:false,//是否显示验证码框
				getCodeisWaiting:false,//获取验证码后的有没有过60s的标识
				acquire:'获取验证码',//获取验证码
				disabled:false,//获取验证码按钮是否禁止
				xieyi:true,
			}
		},
		onLoad() {
			console.log(getlogin())
		},
		onBackPress() {
		   if(this.showMask) {  
		     this.showMask = false;  
		     return true;  
		   }else{  
		      uni.showModal({  
		        title: '提示',  
		        content: '是否退出应用？',  
		        success: function(res) {  
		            if (res.confirm) {  
		                // 退出当前应用，改方法只在App中生效  
		                plus.runtime.quit();  
		            } else if (res.cancel) {  
		                console.log('用户点击取消');  
		            }  
		        }  
		      }); 
			   
		      return true;
		   }  
		},
		methods: {
			goxieyi(){
				uni.navigateTo({
					url:"/pages/public/xieyi"
				})
			},
			//账号填写完成后调取设备号
				changexieyi(){
					if(this.xieyi){
						this.xieyi=false;
					}else{
						this.xieyi=true;
					}
					console.log(this.xieyi)
				},
				 getphone(){
					let $phone = /^1(3|4|5|6|7|8|9)\d{9}$/;
					if(this.phone==""||this.phone==null){
						uni.showModal({
							showCancel:false,
							content:"请填写手机号"
						})
						return false;
					}else if(!$phone.test(this.phone)){
						uni.showModal({
							showCancel:false,
							content:"请填写正确的手机号"
						})
						return false;
					}
					let data={};
					this.uuid = plus.device.uuid;
					console.log("uuid"+this.uuid)
					if(this.uuid!=""&&this.uuid!=null){
						data.model=this.uuid;
					}else{
						uni.showModal({
							showCancel:false,
							content:"获取手机唯一标识失败"
						})
						return false;
					}
					data.username=this.phone;
					console.log(data)
					uni.request({
						url: httpPath.filePath+'/api.php/index/login/is_login_first',
						method:'POST',
						header:{'content-type':'application/x-www-form-urlencoded'},
						data: data,
						success: (res) => {
							if(res.data.code==200){
								this.isyz=true;
								console.log(this.acquire)
							}else if (res.data.code==201){
								this.isyz=false;
							}else{
								uni.showModal({
									showCancel:false,
									content:res.data.message
								})
							}
							   
						}
					});
				 },
				 //用户登录
	          tologin(){
				let clientid; 
				clientid=plus.push.getClientInfo().clientid;
				console.log(plus.push.getClientInfo())
	       		let $phone=/^1(3|4|5|6|7|8|9)\d{9}$/;
	       		let $password=/^[0-9a-zA-Z]{6,18}$/g;
	       		if(this.phone==""||this.phone==null){
	       			uni.showModal({
	       				showCancel:false,
	       				content:"请填写手机号"
	       			})
	       			return false;
	       		}else if(!$phone.test(this.phone)){
	       			uni.showModal({
	       				showCancel:false,
	       				content:"请填写正确的手机号"
	       			})
	       			return false;
	       		}
	       		if(this.password==""||this.password==null){
	       			uni.showModal({
	       				showCancel:false,
	       				content:"请填写密码"
	       			})
	       			return false;
	       		}else if(!$password.test(this.password)){
					uni.showModal({
						showCancel:false,
						content:"请输入6~18位的数字或字母"
					})
	       			return false;
	       		}
				if(this.isyz){
					if(this.code==null||this.code==""){
						uni.showModal({
							showCancel:false,
							content:"请输入验证码"
						})
						return false;
					}
				}
				let data={};
				data.username=this.phone;
				data.password=this.password;
				if(this.isyz){
					data.sms_captcha=this.code;
				}
				
				if(clientid!=null && clientid!="null"){
					data.cid=clientid;
				}else{
					uni.showModal({
						showCancel:false,
						content:"手机型号获取错误"
					})
					return false;
				}
				
				if(!this.xieyi){
					uni.showModal({
						showCancel:false,
						content:"请阅读服务协议"
					})
					return false;
				}
	       		uni.request({
	       		    url: httpPath.filePath+'api.php/index/login/login',
	       		    method:'POST',
	       		    header:{'content-type':'application/x-www-form-urlencoded'},
	       		    data: data,
	       		    success: (res) => {
						if(res.data.code=="200"){
							uni.setStorage({
							    key: 'user',
							    data: res.data.result,
							    success: function () {
							        console.log('success');
							    }
							});
							// uni.switchTab({
							//     url:'../index/index'
							// })
							uni.navigateTo({
								url:"../index/index"
							})
						}else{
							uni.showModal({
								showCancel:false,
								content:res.data.message,
							})
						}      
	       		    }
	       		});
	       	},
			// 获取验证码
             getsms_captcha(){
                if(this.getCodeisWaiting){
					uni.showModal({
						showCancel:false,
						content:"验证码不能重复发送"
					})
                    return;
                }
                let phones=/^1(3|4|5|6|7|8|9)\d{9}$/;
                if(!phones.test(this.phone)||this.phone==""||this.phone==null){
                    uni.showModal({
                    	showCancel:false,
                    	content:"请输入正确的手机号"
                    })
                    return false;
                }
                this.getCodeisWaiting = true;
				
                setTimeout(()=>{
                	this.setTimer();
                },1000)
                
            },
			setTimer(){
				
				let holdTime = 60;
				this.Timer = setInterval(()=>{
					if(holdTime<=0){
						this.disabled = false;
						this.acquire = "获取验证码"
						clearInterval(this.Timer);
						return ;
					}
			        if(holdTime==55){
			            uni.request({
			               url: httpPath.filePath+'/api.php/index/login/get_captcha', //短信验证码。
			               method:'POST',
			               header:{'content-type':'application/x-www-form-urlencoded'},
			               data: {mobile:this.phone,type:1},
			               success: (res) => {
			                   if(res.data.code && res.data.code==200){
			                       this.orderId = res.data.result.sms_captcha;
								   uni.showToast({title: '验证码已发送',icon:"none"});
			                   }else{
			                       uni.showModal({
			                       	showCancel:false,
									content:res.data.message
			                       })
			                       this.acquire = "获取验证码"
			                       this.getCodeisWaiting = false;
			                       clearInterval(this.Timer);
			                       return
			                   }
			               }
			           }); 
			        }
					this.acquire = holdTime+'(s)'
					holdTime--;
					this.disabled = true;
					// this.time = holdTime
				},1000)
			},
		}
	}

</script>

<style>
	@import "../../colorui/main.css";
	page{background: #FFFFFF;}
	.logo{margin: 100rpx 0px;}
	.login_title{padding-left: 10%;font-size: 50rpx;font-weight: bold;color: #333333; }
	input{width: 80%;display: block;margin:30px auto 10px;padding-left: 30px;border-bottom: 1px solid #e0e1e3;height: 80rpx;}
	.phone{background: url(../../static/img/login1.png)no-repeat;background-size: 20px; background-position: 0px 7px;}
	.password{background: url(../../static/img/login2.png) no-repeat;background-size: 20px; background-position: 0px 7px;}
	.yanzhengma{background: url(../../static/img/login.png)no-repeat;background-size: 20px; background-position: 0px 7px;width:58%!important;margin: 0px!important;}
    .getyz {width: 37%;margin-left: 5%;font-size: 30rpx;color: #1e99ff;background: #FFFFFF;border: 1px solid #1e99ff;}
	.getyz::after{border: none;}
	.xieyi{color: rgb(184, 184, 184);padding-left: 8%;line-height: 30px;}
</style>
